<%@page import="backend.db.ORM"%>
<%@page import="backend.Course"%>
<%@page import="java.util.Iterator"%>
<script type="text/javascript" src="shared/autosuggest.js"></script>
<script type="text/javascript" src="shared/searchCourse.js"></script>
<link rel="stylesheet" type="text/css" href="style/autosuggest.css" />
<div id="main-searchCourse" style="text-align:center;">
	<%
		Iterable<Course> allCourses = ORM.getAllCoursesShallow();
		if (!allCourses.iterator().hasNext())
			out.print("<h2 class=\"errorText\">We are sorry, but there aren't any courses in the system.</h2>");
		else {
	%>
		<table style="width:50%;position:absolute;left:30%;top:50%;">
			<tbody>
				<tr>
					<td style="width:50%;">
						<h3 class="par2">by course name: </h3>
					</td>
					<td>
						<h3 class="par2">by course id: </h3>
					</td>
				</tr>
				<tr>
					<td>
						<div id="autosuggest" class="autosuggest"></div>
						<input type="text" id="courseName" name="courseName" onblur="setTimeout(function(){hide('autosuggest');}, 200);" />
						<script type="text/javascript">
							var courseNames = new Array(<%
									Iterator<Course> it = allCourses.iterator();
									out.print("\"" + it.next().courseName + "\"");
									while (it.hasNext())
										out.print(", \"" + it.next().courseName + "\"");
									%>);
							new AutoSuggest(document.getElementById("courseName"), courseNames, searchByName, "autosuggest");
						</script>
					</td>
					<td>
						<div id="autosuggest2" class="autosuggest"></div>
						<input type="text" id="courseId" name="courseId" onblur="setTimeout(function(){hide('autosuggest2');}, 200);" />
						<script type="text/javascript">
							var courseIds = new Array(<%
									Iterator<Course> it2 = allCourses.iterator();
									out.print("\"" + it2.next().courseId + "\"");
									while (it2.hasNext())
										out.print(", \"" + it2.next().courseId + "\"");
									%>);
							new AutoSuggest(document.getElementById("courseId"), courseIds, searchById, "autosuggest2");
						</script>
					</td>
					
				</tr>
			</tbody>
		</table>
	<%} %>
</div>
